[WEB-2912]chore: modified link behaviour to improve accessibility #6284
Conversation
WalkthroughThe pull request modifies two components ( Changes
Sequence DiagramsequenceDiagram
participant User
participant LinkComponent
participant Browser
participant Clipboard
User->>LinkComponent: Click link
LinkComponent->>Browser: Open link in new tab
User->>LinkComponent: Click copy icon
LinkComponent->>Clipboard: Copy link URL
LinkComponent->>User: Show toast notification
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (2)
web/core/components/modules/links/list-item.tsx (1)
68-73: Consider consistently copying the URL instead of the title for clarity.
Currently, the text copied to the clipboard depends on whether a title is present, which might be unintuitive for users expecting to get the actual link. Consider always copyinglink.urlor providing a configurable option.web/core/components/issues/issue-detail/links/link-item.tsx (1)
65-77: Adequate user feedback is provided upon copying.
The callback triggers a toast notification, informing the user of a successful copy action. Consider error handling if clipboard writes fail (e.g., in older browsers or special contexts).
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
web/core/components/issues/issue-detail/links/link-item.tsx(2 hunks)web/core/components/modules/links/list-item.tsx(3 hunks)
🔇 Additional comments (4)
web/core/components/modules/links/list-item.tsx (2)
2-2: Imports look good and are properly used.
The newly added Copy icon is relevant to the updated copy-to-clipboard functionality and the rest of the icons (LinkIcon, Pencil, Trash2) are indeed being utilized.
48-50: Use of anchor tag for direct navigation is correct.
Embedding the link in an anchor tag (<a>) with target="_blank" and rel="noopener noreferrer" is a standard, secure approach to opening links in a new tab, and also supports accessibility.
web/core/components/issues/issue-detail/links/link-item.tsx (2)
5-5: Import statements updated appropriately.
The newly added Copy icon is properly referenced, aligning with the link-copy functionality.
51-58: Replacing clickable text with an anchor tag improves user clarity.
Wrapping the link in an <a> tag clarifies that clicking on the text navigates the user to the URL, while also preserving accessibility and security with noopener noreferrer.
Description
Updated the Link component to allow clicking anywhere on the link to open it in a new tab. Replaced the external link icon with a copy link icon for improved functionality.
Type of Change
References
WEB-2912
Summary by CodeRabbit
New Features
Copyicon for copying links instead of using theExternalLinkicon.Bug Fixes